﻿@model SILAS.Entidades.Visita

@{
    ViewBag.Title = "Create";
}

@section js{
    <script type="text/javascript">


        $(function () {

            var ciudadano;
            var empleado;

            $("#txtBuscarCiudadano").autocomplete({
                source: '@Url.Action("GetCiudadanos", "Ciudadano")',
                minLength: 1,
                focus: function (event, ui) {
                    var select = ui.item;
                    $("#txtBuscarCiudadano").val(select.label);
                    return false;
                },
                select: function (event, ui) {
                    var select = ui.item;
                    $("#txtBuscarCiudadano").val(select.label);
                    ciudadano = select.ciudadano;
                    return false;
                }
            });

            $("#add").click(function (e) {
                e.preventDefault();

                var row = $("#tblCiudadanos >tbody >tr").length;


                var filaTable = '<tr>';
                filaTable += '<td> <input type=\"hidden\" name=\"DetalleVisitas[' + row + '].IdCiudadano\" value=\"' + ciudadano.IdCiudadano + '\" />' + ciudadano.Nombres +' ' +ciudadano.ApPaterno + ' ' +ciudadano.ApMaterno + '</td>';
                filaTable += '<td>' + ciudadano.DNI + '</td>';
                filaTable = filaTable + '</tr>';

                $("#tblCiudadanos tbody").append(filaTable).fadeIn("slow");
            });
        });
        </script>
    

    <script type="text/javascript">
        $(function () {
            $("#txtBuscarEmpleado").autocomplete({
                source: '@Url.Action("GetEmpleado", "Empleado")',
                minLength: 1,
                focus: function (event, ui) {
                    var select = ui.item;
                    $("#txtBuscarEmpleado").val(select.label);
                    return false;
                },
                select: function (event, ui) {
                    var select = ui.item;
                    $("#txtBuscarEmpleado").val(select.label);
                    empleado = select.empleado;
                    return false;
                }
            });

            $("#add2").click(function (e) {
                e.preventDefault();

                var row = $("#tblEmpleado >tbody >tr").length;

                if (row == 0) {
                    var filaTable = '<tr>';
                    filaTable += '<td> <input type=\"hidden\" name=\"DetalleVisitas[' + row + '].IdEmpleado\" value=\"' + empleado.IdEmpleado + '\" />' + empleado.Nombres + ' ' + empleado.ApPaterno + ' ' + empleado.ApMaterno + '</td>';
                    filaTable += '<td>' + empleado.DNI + '</td>';
                    filaTable += '<td>' + empleado.Cargo + '</td>';
                    filaTable = filaTable + '</tr>';

                    $("#tblEmpleado tbody").append(filaTable).fadeIn("slow");
                }
                else {
                    var sinErrores = true;

                    $("#tblEmpleado  tbody tr td:nth-child(1)").each(function (index, element) {
                        var IdEmpleado = $(element).find("input:eq(0)").val();
                        if (IdEmpleado == empleado.IdEmpleado) {
                            sinErrores = false;
                            return;
                        }
                    });

                    if (sinErrores) {
                        var filaTable = '<tr>';
                        filaTable += '<td> <input type="hidden" name=\"DetalleVisitas[' + row + '].IdEmpleado\" value=\"' + empleado.IdEmpleado + '\" />' + empleado.Nombres + ' ' + empleado.ApPaterno + ' ' + empleado.ApMaterno + '</td>';
                        filaTable += '<td>' + empleado.DNI + '</td>';
                        filaTable += '<td>' + empleado.Cargo + '</td>';
                        filaTable = filaTable + '</tr>';

                        $("#tblEmpleado tbody").append(filaTable).fadeIn("slow");
                    }
                    else {
                        alert('El Ciudadano ya esta como participante');
                    }


                }
            });
        });


        $(document).ready(function () {
            $('.date').datepicker({ dateFormat: "dd/mm/yy" });
        });

    </script>
}

<h2>Create</h2>

<script src="@Url.Content("~/Scripts/jquery.ui.datepicker.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<!--se aumento desde el post-->
@using (Html.BeginForm("Create", "Visita", FormMethod.Post, new { enctype = "multipart/form-data", id = "frmVisita" }))
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Visita</legend>
        <table>
         <tr>
            <td>
        <div class="editor-label">
            @Html.LabelFor(model => model.IdVisita)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.IdVisita)
            @Html.ValidationMessageFor(model => model.IdVisita)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Fecha)
        </div>
        <div class="editor-field">

           

            @Html.EditorFor(model => model.Fecha)
            @Html.ValidationMessageFor(model => model.Fecha)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Observaciones)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Observaciones)
            @Html.ValidationMessageFor(model => model.Observaciones)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Acuerdos)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Acuerdos)
            @Html.ValidationMessageFor(model => model.Acuerdos)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.IdSector)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.IdSector)
            @Html.ValidationMessageFor(model => model.IdSector)
        </div>
        <div class="editor-label">
            @Html.Label("Acta de la visita")
        </div>
        <div class="editor-field">
            <input type="file" id="ActaVisita" name="ActaVisita" />
        </div>
         </td>
            
            <td>
              <table id="tblCiudadanos" border="0" cellpadding="0" cellspacing="0">
                <thead>
                  <tr>
                    <th>
                        Nombres
                    </th>
                    <th>
                        DNI
                    </th>
                </tr>
              </thead>

             <tbody>
                      
                  
            </tbody>  
            
            </table>

            @Html.Label("Buscar:")
            @Html.TextBox("txtBuscarCiudadano")
            <button type="button"  id="add">Añadir Ciudadano</button>
                
           </td>





           <td>
              <table id="tblEmpleado" border="0" cellpadding="0" cellspacing="0">
                <thead>
                  <tr>
                    <th>
                        Nombres
                    </th>
                    <th>
                        DNI
                    </th>
                    <th>
                        Cargo
                    </th>
                </tr>
              </thead>

             <tbody>                   
                  
            </tbody>  
            
            </table>

            @Html.Label("Buscar:")
            @Html.TextBox("txtBuscarEmpleado")
            <button id="add2">Añadir Empleado</button>
                
           </td>


             
         </tr>       
        </table>
        
        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Regresar", "ListarVisitas")
</div>
